<template>
    <el-dialog v-model="dialogVisible" :width="width" custom-class="eq-dialog">
        <div class="header">
            <span class="title">{{ title }}</span>
            <i class="iconfont icon-guanbi" @click="handleCancel"></i>
        </div>
        <div class="content">
            <slot></slot>
        </div>
        <template #footer>
            <div class="dialog-footer">
                <span class="resetBtn" @click="handleCancel">取消</span>
                <span class="searchBtn" @click="handleConfirm">
                    确定
                </span>
            </div>
        </template>
    </el-dialog>
</template>

<script setup>

const props = defineProps({
    title: {
        type: String,
        default: '提示'
    },
    width: {
        type: String,
        default: '500'
    }
});

const emit = defineEmits('deleteTarget');

const dialogVisible = defineModel('dialogVisible');

const handleCancel = () => {
    dialogVisible.value = false;
};

const handleConfirm = () => {
    emit('deleteTarget');
};

</script>

<style lang="scss">
@import url('./Dialog.scss');
</style>